<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title>气象建议</title>
		<link rel="stylesheet" type="text/css" href="./bootstrap-3.4.1-dist/css/bootstrap.css">
		<script type="text/javascript" src="js/jQuery.js"></script>
		<script type="text/javascript" src="js/FileSaver.js"></script>
		<script type="text/javascript" src="js/wordexport.js"></script>
		<script type="text/javascript" src="./bootstrap-3.4.1-dist/js/bootstrap.js"></script>

		<style>
			.tableTD {
				width: 25%;
				text-align: center;
				vertical-align: middle;
			}
			
			.inputView {
				width: 30px;
				border: none;
				text-align: center;
			}
		</style>
		
		<script src="js/data.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div class="" style="100%">
			<div class="center-block" style="width: 500px;" id="">
				<table class="table table-bordered" style="width: 100%;">
					<tbody>
				
					<!-- 风力 -->
					<tr>
						<td class="tableTD">
							<span>风力</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="minWind" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>级</span>
						</td>
						<td class="tableTD">
							<span>-</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="maxWind" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>级</span>
						</td>
					</tr>
				
					<!-- 降水 -->
					<tr>
						<td class="tableTD">
							<span>降水</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="minWater" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>mm</span>
						</td>
						<td class="tableTD">
							<span>-</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="maxWater" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>mm</span>
						</td>
					</tr>
				
					<!-- 能见度 -->
					<tr>
						<td class="tableTD">
							<span>能见度</span>
						</td>
						<td class="tableTD">
				
						</td>
						<td class="tableTD">
							<span><</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="visibility" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>m</span>
						</td>
					</tr>
				
					<!-- 温度 -->
					<tr>
						<td class="tableTD">
							<span>温度</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="minTemperature" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>℃</span>
						</td>
						<td class="tableTD">
							<span>-</span>
						</td>
						<td class="tableTD">
							(<input class="inputView" id="maxTemperature" oninput="value=value.replace(/[^\d]/g,'')"></input>)<span>℃</span>
						</td>
					</tr>
				
				<!-- 大风 -->
				<tr>
					<td class="tableTD">
						<span>大风</span>
					</td>
					<td class="tableTD">
						<select class="form-control" id="gale">
							<option value="0">无</option>
							<option value="1">蓝色预警</option>
						  <option value="2">黄色预警</option>
						  <option value="3">橙色预警</option>
						  <option value="4">红色预警</option>
						</select>
					</td>
					<td class="tableTD">
								
					</td>
					<td class="tableTD">
								
					</td>
				</tr>
				
					<!-- 雷电 -->
					<tr>
						<td class="tableTD">
							<span>雷电</span>
						</td>
						<td class="tableTD">
							<select class="form-control" id="thunder">
								<option value="0">无</option>
							  <option value="1">黄色预警</option>
							  <option value="2">橙色预警</option>
							  <option value="3">红色预警</option>
							</select>
						</td>
						<td class="tableTD">
				
						</td>
						<td class="tableTD">
				
						</td>
					</tr>
				
					<!-- 雾 -->
					<tr>
						<td class="tableTD">
							<span>雾</span>
						</td>
						<td class="tableTD">
							<select class="form-control" id="fog">
								<option value="0">无</option>
							  <option value="1">黄色预警</option>
							  <option value="2">橙色预警</option>
							  <option value="3">红色预警</option>
							</select>
						</td>
						<td class="tableTD">
				
						</td>
						<td class="tableTD">
				
						</td>
					</tr>
					
					<!-- 雨加雪 -->
					<tr>
						<td class="tableTD">
							<span>雨加雪</span>
						</td>
						<td class="tableTD">
							<select class="form-control" id="rain">
							  <option value="0">无</option>
							  <option value="1">有</option>
							</select>
						</td>
						<td class="tableTD">
					
						</td>
						<td class="tableTD">
					
						</td>
					</tr>
					<!-- 按钮 -->
					<tr>
						<td class="tableTD" colspan="4">
							<button type="button" class="btn btn-info" onclick="sureClick()">生成建议</button>
						</td>
					</tr>
				
					<!-- 单选 -->
					<tr>
						<div class="btn-group" id="recommendType" data-toggle="buttons">
				
							<td class="tableTD">
								<div class="radio"><input type="radio" name="optradio" checked value="1">港口</div>
							</td>
							<td class="tableTD">
								<div class="radio"><input type="radio" name="optradio" value="2">电力</div>
							</td>
							<td class="tableTD">
								<div class="radio"><input type="radio" name="optradio" value="3">鞍钢</div>
							</td>
							<td class="tableTD">
								<div class="radio"><input type="radio" name="optradio" value="4">供暖</div>
							</td>
						</div>
					</tr>
					</tbody>
				</table>
				
				<div id="" style="">
					<textarea id="recommendView" style="width: 100%;height:100px"></textarea>
				</div>
				
				<div class="center-block" style="text-align: center;">
					<button id="downBtn" type="button" class="btn btn-info" onclick="downClick()">下载建议</button>
				</div>
				
				<div id="downContent" style="display: none;">
				    <h1>我是表头</h1>
						<p id="downContentStr">
							
						</p>
					<h1>我是表尾</h1>
				</div>
			</div>

			
			
		</div>
		
	</body>
</html>
